<template>
  <div>
    <div>
      <el-form  :inline="true" :model="A" style="backglound-image:https://tse3-mm.cn.bing.net/th/id/OIP-C.ggbLcZwMUAuCB3ATrnJLggHaMW?w=182&h=304&c=7&r=0&o=5&dpr=1.25&pid=1.7">
            <el-form-item prop="" label="名称：" >
                <el-input v-model="A.pkName" placeholder="请输入内容" style="margin-left: 0px;width: 200px" ></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="success" icon="el-icon-search" @click="lxmhc()"></el-button>
            </el-form-item>
            <el-button type="primary" style="margin-left: 300px;width: 100px;broder-radius:50px;" @click="tianjia()">添加</el-button>
        </el-form>
    </div>
      <div>
      
      <el-table border :data="Data.slice((currentPage-1)*pagesize,currentPage*pagesize)" style="width: 100%">
        <el-table-column label="名称" prop="pkName"></el-table-column>
        <el-table-column label="状态" prop="pkState"></el-table-column>
        <el-table-column label="包含套餐" prop="pkMenu"></el-table-column>
        <el-table-column label="描述" prop="pkDescription"></el-table-column>
        <el-table-column label="修改时间" prop="updateTime"></el-table-column>
        <el-table-column label="操作" v-slot="a">
            <el-button type="primary" @click="xiugai(a.row)">修改</el-button>
            <el-button type="primary" @click="shanchu(a.row)">删除</el-button>
        </el-table-column>
      </el-table>
      <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[3, 5, 7]"
                :page-size="pagesize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="Data.length">
        </el-pagination>
      </div>
      <div>
          <el-dialog title="添加" :visible.sync="AddMtk">
              <el-form :model="add">
                <el-form-item label="名称">
                    <el-input v-model="add.pkName" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="状态">
                    <el-input v-model="add.pkState" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="包含套餐">
                    <el-input v-model="add.pkMenu" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="描述">
                    <el-input v-model="add.pkDescription" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-button type="primary" @click="pkAdd()">确定</el-button>
                <el-button type="primary" @click="AddMtk=false"></el-button>
              </el-form>
          </el-dialog>
      </div>
      <div>
          <el-dialog title="修改" :visible.sync="UpdMtk">
              <el-form :model="upd">
                <el-form-item label="名称">
                    <el-input v-model="upd.pkName" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="状态">
                    <el-input v-model="upd.pkState" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="包含套餐">
                    <el-input v-model="upd.pkMenu" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-form-item label="描述">
                    <el-input v-model="upd.pkDescription" placeholder="请输入内容"></el-input>
                </el-form-item>
                <el-button type="primary" @click="pkUpd()">确定</el-button>
                <el-button type="primary" @click="AddMtk=false">取消</el-button>
              </el-form>
          </el-dialog>
      </div>
      <div>
      <el-dialog title="是否删除" :visible.sync="delmtk" :model="del">
        <el-button type="primary" @click="delpk()">确定</el-button>
        <el-button type="primary" @click="delmtk=false" >取消</el-button>
      </el-dialog>
    </div>
  </div>
</template>

<script>
export default {
    created(){
        this.findPackAll();
    },
    data(){
        return{
            Data:[],
            AddMtk:false,
            UpdMtk:false,
            delmtk:false,
            upd:{},
            add:{},
            del:{},
            A:{pkName:''},
            headertitle: "",
            centerDialogVisible:false,
            pagesize:3,
            currentPage:1,
        }
    },
    methods:{
        findPackAll(){
            this.$axios.get("/user/user/doctor/ren/findPackAll").then(res=>{
                this.Data=res.data.data.list
            })
        },
        tianjia(){
            this.AddMtk=true;
        },
        pkAdd(){
            this.$axios.post("/user/user/doctor/ren/pkAdd",this.add).then(res=>{
                this.add={};
                this.AddMtk=false;
                this.findPackAll();
            })
        },
        xiugai(row){
            this.UpdMtk=true;
            this.upd={...row};
        },
        pkUpd(){
            this.$axios.post("/user/user/doctor/ren/pkUpd",this.upd).then(res=>{
                this.upd={};
                this.UpdMtk=false;
                this.findPackAll();
            })
        },
        shanchu(row){
            this.delmtk=true;
            this.del={...row}
        },
        delpk(){
            this.$axios.post("/user/user/doctor/ren/delpk",this.del).then(res=>{
            this.delmtk=false;
            this.findPackAll();
        })
        },
        lxmhc(){
             this.$axios.get("/user/user/doctor/ren/mhcpy",{params:{pkName:this.A.pkName}}).then(res=>{
                 this.Data = res.data.data.list;
             })
        },
        handleSizeChange(size) {
            this.pagesize = size;
        },
        handleCurrentChange(currentPage) {
                this.currentPage = currentPage;
      }
    }
}
</script>

<style>

</style>